<template>
  <view class="pr">
    <view class="vip-head">
      <view class="vip-user-info fc-bet" @click="goToProfile">
        <view class="fc">
          <image src="../../../../static/img/index/avatar.png" alt="" class="avator"></image>
          <text class="h3">{{ getUserInfo.phoneNumber }}</text>
          <label>{{ memberType }}</label>
        </view>
        <view class="fc right" @click="goToMemberExplanation">
          <span>会员说明</span>
          <navigator :url="tipUrl" class="fc">
            <image src="@/static/img/my/tip-yellow.png" alt=""></image>
          </navigator>
        </view>
      </view>
      <view class="vip-card-box">
        <view class="inner">
          <h2>{{ memberType }}</h2>
          <p>参加项目利息率 {{ interestRate }}</p>
          <p>会员等级符合下列要求即可自动升级</p>
          <view class="stadus">
            <image src="@/static/img/my/label-dkt.png" alt=""></image>
          </view>
          <view class="fcc"></view>
        </view>
      </view>
    </view>
    <navigator :url="vipUrl" class="btn-vip fcc">
      <span>永久尊享</span>
    </navigator>
    <view class="vip-content">
      <view class="in">
        <view class="h2">成为会员·尊享权益</view>
        <view class="fcc vip-tq">
          <view class="fc">
            <image src="@/static/img/my/vip-tq1.png" alt=""></image>
            <span>项目加息</span>
          </view>
          <view class="fc">
            <image src="@/static/img/my/vip-tq2.png" alt=""></image>
            <span>服务专享</span>
          </view>
          <view class="fc">
            <image src="@/static/img/my/vip-tq3.png" alt=""></image>
            <span>专属客服</span>
          </view>
          <view class="fc">
            <image src="@/static/img/my/vip-tq4.png" alt=""></image>
            <span>每日抽奖</span>
          </view>
        </view>
        <view class="vip-list7">
          <h3>会员等级升级介绍</h3>
          <view style="margin: 10px;">
            <p>等级介绍等级介绍等级介绍等级介绍</p>
            <view class="h30"></view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import {mapGetters} from 'vuex'
export default {
  data() {
    return {
      avatarUrl: "/usertouxiang//static/index/images/avatar.png",
      username: "155****5555",
      memberType: "普通会员",
      interestRate: "0.00%",
      statusImage: "@/static/img/my/label-dkt.png",
      tipUrl: "/index_guize/11",
      vipUrl: "javascript:void(0);"
    };
  },
  computed:{
	  ...mapGetters(['getUserInfo'])
  },
  mounted() {
  	
	console.log( this.$store.getters['getUserInfo']);
  },
  methods: {
    goToProfile() {
      uni.navigateTo({
        url: "/index_grsz.html"
      });
    },
    goToMemberExplanation() {
      uni.navigateTo({
        url: this.tipUrl
      });
    }
  }
};
</script>

<style scoped>
/* 根据需要添加样式 */
.vip-content .vip-tq {
    margin-bottom: 0.88rem;
    font-size: 0.48rem;
    font-weight: 400;
    letter-spacing: 0.0096rem;
    width: 90vw;
    line-height: 0.7rem;
    color: #f3d79c;
    text-align: left;
    justify-content: space-around;
}
</style>
